<!DOCTYPE html>

<html lang="en">
    <head>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <title>text-transform</title>

        <style type="text/css">
            .wrapper {
                border: 1px solid blue ;
                width: 300px ;
                height: 100px ;
                margin: 15px auto ;
            }

            .first { text-transform: none ; }
            .second { text-transform: uppercase ; }
            .third { text-transform: lowercase ; }
            .fourth { text-transform: capitalize ; }
        </style>

    </head>
    <body>

        <div class="wrapper first">
            The Universal Selector is a Special Type Selector, that represents an element of any element type.
        </div>

        <div class="wrapper second">
            The Universal Selector is a Special Type Selector, that represents an element of any element type.
        </div>

        <div class="wrapper third">
            The Universal Selector is a Special Type Selector, that represents an element of any element type.
        </div>

        <div class="wrapper fourth">
            may the force be <span style="font-variant:small-caps;">with you</span>
        </div>
        
    </body>
</html>